<template>
    <div>
        <el-button @click="showChangeDialog=true" size="mini" class="long">修改密码</el-button>
        <el-dialog
                title="修改密码"
                :visible.sync="showChangeDialog"
                :append-to-body="true"
                center>
            <el-form v-model="changeObj" onsubmit="return false;" @keyup.enter.native="changePassword">
                <el-form-item>
                    <el-input v-model="changeObj.oldPwd" placeholder="旧密码" show-password maxlength="20"
                              show-word-limit></el-input>
                </el-form-item>
                <el-form-item>
                    <el-input v-model="changeObj.newPwd" placeholder="新密码" show-password maxlength="20"
                              show-word-limit></el-input>
                </el-form-item>
                <el-form-item>
                    <el-input v-model="changeObj.checkNewPwd" placeholder="重复新密码" show-password maxlength="20"
                              show-word-limit></el-input>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="changePassword" class="long">确定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
    import {mapGetters} from 'vuex'

    export default {
        name: "ChangePassword",
        data() {
            return {
                showChangeDialog: false,
                changeObj: {},
            }
        },
        computed: {
            ...mapGetters(['results', 'getPassword']),
        },
        methods: {
            changePassword() {
                let old = this.getPassword;
                let oldCheck = this.changeObj.oldPwd;
                let newPwd = this.changeObj.newPwd;
                let newPwdCheck = this.changeObj.checkNewPwd;
                if (!newPwd || newPwd.trim().length <= 0) {
                    this.$utils.AppMessage.error('请输入新密码');
                    return;
                }
                newPwd = newPwd.trim();
                if (!newPwdCheck || newPwdCheck.trim().length <= 0 || newPwd !== newPwdCheck) {
                    this.$utils.AppMessage.error('两次新密码不一致');
                    return;
                }
                newPwdCheck = newPwdCheck.trim();
                if (oldCheck !== old) {
                    this.$utils.AppMessage.error('旧密码错误！');
                    return;
                }
                this.$store.dispatch('updatePassword', newPwd).then(() => {
                    this.$utils.AppMessage.success('修改成功！');
                    this.showChangeDialog = false;
                });
            }
        }
    }
</script>

<style scoped>

</style>